<template>
  <div class="child">
    <h2>我是Child组件</h2>
    <h3>我拥有一个玩具:{{toy}}</h3>
    <h3>我拥有一个电脑:{{computer}}</h3>
    <button @click="handleToy">把玩具和电脑给爹用用</button>
    <button @click="unbind">生气了，解绑send-computer</button>
  </div>
</template>

<script>
  export default {
    name:'Child',
    data() {
        return {
            toy:'奥特曼',
            computer:'联想'
        }
    },
    methods: {
      handleToy(){
        this.$emit('send-toy',this.toy)
        this.$emit('send-computer',this.computer)
        this.$emit('click',778899)
      },
      unbind(){
        this.$off('send-computer')
      }
    },
  }
</script>

<style scoped>
    .child {
        background-color: skyblue;
        padding: 20px;
    }
</style>